import {
	Button,
	Collapse,
	Form,
	Row,
	Col,
	Input,
	Select,
	DatePicker,
	TreeSelect,
	Cascader,
	message,
} from 'antd'
import React, {useState, useEffect, memo} from 'react'
// import {KeepAlive, history, connect} from 'umi'
import {history, connect, useRequest} from 'umi'
import moment from 'moment'
import 'moment/locale/zh-cn'

import styles from './index.less'
import {translateDataToTree} from '@/utils/common/index'
import {getAllCitysPermission, getCompany} from '@/service/common/index'
import {
	getOrderType,
	save,
	editUpdate,
	editInit,
	copySave,
	detail,
	getOnlyCode,
} from '@/service/marketing/commodity'
import {channelOnlyCode} from '@/service/merchantCenter/channelRule'

import {getCarTypeList} from '@/service/carMessage/list'
import {getDict} from '@/service/common/dict'
import {getMainCompanyList} from '@/service/system/company'
import OrderTypeOne from '../components/OrderTypeOne'
import OrderTypeTwo from '../components/OrderTypeTwo'
import OrderTypeThree from '../components/OrderTypeThree'
import Modal from '../components/Modal/index'
import {twoDecimalPattern} from '@/utils/common/validator'
import {GlobalState} from '@/models/global'

const {Panel} = Collapse
const {TextArea} = Input
interface CityOption {
	value: string | number
	label: string
	children?: CityOption[]
}
export interface FixedBarProps {
	global: GlobalState
	user: any
	dispatch: any
	location: any
}
const changeList: any = [
	{
		name: '主体名称',
		key: 'subjectId',
		msg: '价格信息数据尚未保存，确定还要改变主体名称吗？',
	},
	{
		name: '所属公司',
		key: 'affiliatedCompanyId',
		msg: '价格信息数据尚未保存，确定还要改变所属公司吗？',
	},
	{
		name: '城市名称',
		key: 'city',
		msg: '价格信息数据尚未保存，确定还要改变城市名称吗？',
	},
	{
		name: '品牌/车系/车型',
		key: 'brandId',
		msg: '价格信息数据尚未保存，确定还要改变品牌/车系/车型吗？',
	},
	{
		name: '订单类型',
		key: 'rentTypeId',
		msg: '价格信息数据尚未保存，确定还要改变订单类型吗？',
	},
	{
		name: '开始时间',
		key: 'beginTime',
		msg: '价格信息数据尚未保存，确定还要改变开始时间吗？',
	},
	{
		name: '结束时间',
		key: 'endTime',
		msg: '价格信息数据尚未保存，确定还要改变结束时间吗？',
	},
]

const customizeHeader = (value: string) => (
	<div>
		<div className={styles.tip} />
		{value}
	</div>
)

const view = memo(
	({
		global: {currentRoute},
		dispatch,
		location,
		user: {orgId, permissionID},
	}: FixedBarProps) => {
		const [form] = Form.useForm()
		const [commodityPlanId, setCommodityPlanId] = useState<any>()
		const [type, setType] = useState<string>()
		const [orderType, setOrderType] = useState<any>([])
		const [mainCompany, setMainCompanyList] = useState<any>([])
		const [otherParams, setOtherParams] = useState<any>()
		// 公司
		const [companyData, setCompanyData] = useState<any[]>([])
		// 城市
		const [citysList, setCitysList] = useState<CityOption[]>([])
		const [carTypeList, setCarTypeList] = useState<any>([])
		const [dict, setDict] = useState({
			star_rating: [],
		})
		// 自定义数据
		const [costitemList, setCostitemList] = useState<any>([])
		// 操作提示
		const [isModalOpen, setIsModalOpen] = useState<any>(false)
		// 复制初始值
		const [copyDataValue, setCopyDataValue] = useState<any>()
		const [copyDataName, setCopyDataName] = useState<any>()
		const [selectItem, setSelectItem] = useState<any>()
		// 初始化唯一code
		const [onlyCode, setOnlyCode] = useState<any>()
		// 初始化渠道唯一code
		const [onlyChannelCode, setOnlyChannelCode] = useState<any>()

		/** 初始化唯一code */
		const getOnlyCodeFun = (id?: any) => {
			getOnlyCode({id}).then((res: any) => {
				if (res?.success) {
					setOnlyCode(() => res?.data)
				}
			})
		}

		/** 初始化渠道唯一code */
		const getChannelOnlyCodeFun = (rentSchemeId?: any) => {
			channelOnlyCode({rentSchemeId}).then((res: any) => {
				if (res?.success) {
					setOnlyChannelCode(() => res?.data)
				}
			})
		}

		/** 获取订单类型列表 */
		const getOrderTypeFun = () => {
			getOrderType().then((res: any) => {
				if (res?.success) {
					setOrderType(() => res?.data)
				}
			})
		}

		// 初始化-城市
		const getCitysFun = (id: string, ctype: boolean) => {
			const d = {
				permission: permissionID,
				orgId: id,
			}
			getAllCitysPermission(d).then((res: any) => {
				if (res?.data) {
					setCitysList(() => res.data)
					if (ctype) {
						form.setFieldsValue({city: null})
					}
				}
			})
		}

		/** 获取所属公司数据 */
		const onCompany = (merchantId: string, ctype: boolean) => {
			getCompany({merchantId}).then((res: any) => {
				if (res?.success) {
					const data = res?.data
					res?.data?.forEach(
						(
							item: {disabled: boolean; type: any},
							index: number,
						) => {
							if (item.type !== 0) {
								data[index].disabled = true
							}
						},
					)
					const list = translateDataToTree(data)
					setCompanyData(list as any)
					if (ctype) {
						form.setFieldsValue({
							affiliatedCompanyId: null,
							city: null,
						})
					}
				}
			})
		}
		// 获取品牌车系
		const onCarTypeListFun = () => {
			getCarTypeList().then((res: any) => {
				if (res?.success) {
					const list = res?.data?.map((item: any) => {
						const newItem = item
						newItem.id = item?.id?.toString()
						return newItem
					})
					setCarTypeList(() => list)
				}
			})
		}

		// 获取主体数据
		const onMainCompanyeListFun = () => {
			getMainCompanyList().then((res: any) => {
				if (res?.success) {
					const list = res?.data?.map((item: any) => {
						const newItem = item
						newItem.id = newItem?.id?.toString()
						return newItem
					})
					setMainCompanyList(() => list)
				}
			})
		}

		// 初始化无条件接口
		useEffect(() => {
			getOrderTypeFun()
			onCarTypeListFun()
			onMainCompanyeListFun()
			getDict(
				{
					dictKeys: ['star_rating'],
				},
				(res: any) => {
					setDict(res)
				},
			)
		}, [])

		// 初始化与组织机构关联接口
		useEffect(() => {
			onCompany('', false)
		}, [orgId])

		// 设置开始日期不能选择的时间
		const disabledFinishTimeDate = (startValue: any) => {
			const endTime = form.getFieldValue('endTime')
			if (!startValue || !endTime) {
				return false
			}
			return startValue.valueOf() > endTime.valueOf()
		}

		// 设置结束不能选择的时间
		const disabledStartTimeDate = (endValue: any) => {
			const beginTime = form.getFieldValue('beginTime')
			if (!endValue || !beginTime) {
				return false
			}
			return endValue.valueOf() <= beginTime.valueOf()
		}

		// 初始化-编辑数据
		const getEditInit = (id: string, types?: string) => {
			editInit({id}).then((res: any) => {
				if (res?.success) {
					const reaData = {
						...res.data,
						beginTime: moment(res?.data?.beginTime),
						endTime: moment(res?.data?.endTime),
						city: [res?.data?.provinceId, res?.data?.cityId],
					}
					form.setFieldsValue(reaData)
					setCopyDataValue(reaData)
					const params = {
						subjectName: res?.data?.subjectName,
						affiliatedCompany: res?.data?.affiliatedCompany,
						provinceName: res?.data?.provinceName,
						provinceId: res?.data?.provinceId,
						cityName: res?.data?.cityName,
						cityId: res?.data?.cityId,
						brandInfo: res?.data?.brandInfo,
						carStar: res?.data?.carStar,
						rentTypeName: res?.data?.rentTypeName,
					}
					setOtherParams(() => params)
					setCopyDataName(() => params)
					setCostitemList(() =>
						res?.data?.rentSchemeVOList?.map((item: any) => {
							const newItem = item
							const driver =
								types !== 'copy'
									? newItem?.rentDriverVOList
									: []
							const channel =
								types !== 'copy'
									? newItem?.rentChannelVOList
									: []
							return {
								...newItem,
								rentDriverVOList: driver,
								rentChannelVOList: channel,
								orginRentAmount: newItem?.rentAmount,
								orginRenewRentAmount: newItem?.renewRentAmount,
								orginAdvancePaymentAmount:
									newItem?.advancePaymentAmount,
								orginBalancePaymentAmount:
									newItem?.balancePaymentAmount,
							}
						}),
					)
					if (types === 'edit') {
						getOnlyCodeFun(res?.data?.rentSchemeId)
						getChannelOnlyCodeFun(res?.data?.rentSchemeId)
					}
				}
			})
		}

		// 初始化-详情数据
		const getDetail = (id: string) => {
			detail({id}).then((res: any) => {
				if (res?.success) {
					const reaData = {
						...res.data,
						beginTime: moment(res?.data?.beginTime),
						endTime: moment(res?.data?.endTime),
						city: [res?.data?.provinceId, res?.data?.cityId],
					}
					form.setFieldsValue(reaData)
					setCopyDataValue(reaData)
					const params = {
						subjectName: res?.data?.subjectName,
						affiliatedCompany: res?.data?.affiliatedCompany,
						provinceName: res?.data?.provinceName,
						provinceId: res?.data?.provinceId,
						cityName: res?.data?.cityName,
						cityId: res?.data?.cityId,
						brandInfo: res?.data?.brandInfo,
						carStar: res?.data?.carStar,
						rentTypeName: res?.data?.rentTypeName,
					}
					setOtherParams(() => params)
					setCopyDataName(() => params)
					setCostitemList(() => res?.data?.rentSchemeVOList)
				}
			})
		}

		// 根据路由判断当前页面状态
		useEffect(() => {
			const {id} = location.query
			const hrefs = window.location.href
			if (id) {
				setCommodityPlanId(() => id)
			}
			if (hrefs.includes('add')) {
				// 新增初始化
				setType('add')
				getOnlyCodeFun()
				getChannelOnlyCodeFun()
			} else if (hrefs.includes('edit')) {
				// 编辑初始化
				setType('edit')
				getEditInit(id, 'edit')
			} else if (hrefs.includes('copy')) {
				// 复制初始化
				setType('copy')
				getEditInit(id, 'copy')
				getOnlyCodeFun()
				getChannelOnlyCodeFun()
			} else {
				// 详情初始化
				setType('view')
				getDetail(id)
			}
			getCitysFun('', false)
		}, [])

		// 初始化默认数据
		useEffect(() => {
			const hrefs = window.location.href
			if (hrefs.includes('add')) {
				form.setFieldsValue({
					rentTypeId: orderType[0]?.code,
				})
				setOtherParams({
					rentTypeName: orderType[0]?.name,
				})
				// setRentTypeId(() => orderType[0]?.code)
				setCopyDataValue({
					...copyDataValue,
					rentTypeId: orderType[0]?.code,
				})
			}
		}, [orderType])

		// 表单数据关联变化
		const onChangeList = (key: string) => {
			const item = changeList?.filter(
				(opt: {key: string}) => opt?.key === key,
			)[0]
			setSelectItem(() => item)
		}

		// 主体变化
		const onSubjectNameChange = (value: string, option: any) => {
			const params = {...otherParams, subjectName: option?.name}
			setOtherParams(() => params)
			if (costitemList.length) {
				onChangeList('subjectId')
				setIsModalOpen(true)
			} else {
				onCompany(value, true)
			}
		}

		// 所属公司变化
		const onOrgIdChange = (value: string, option: any) => {
			const params = {...otherParams, affiliatedCompany: option[0]}
			setOtherParams(() => params)
			if (costitemList.length) {
				onChangeList('affiliatedCompanyId')
				setIsModalOpen(true)
			} else {
				getCitysFun(value, true)
			}
		}

		// 城市变化
		const onCityChange = (value: any, selectedOptions: any) => {
			if (costitemList.length) {
				onChangeList('city')
				setIsModalOpen(true)
			}
			const params = {
				...otherParams,
				provinceName: selectedOptions[0].name,
				provinceId: selectedOptions[0].id,
				cityName: selectedOptions[1].name,
				cityId: selectedOptions[1].id,
			}
			if (value) {
				setOtherParams(() => params)
			}
		}

		// 品牌/车系/车型变化
		const onBrandIdChange = (value: string, option: any) => {
			if (costitemList.length) {
				onChangeList('brandId')
				setIsModalOpen(true)
			}
			const params = {...otherParams, brandInfo: option?.fullName}
			setOtherParams(() => params)
		}

		// 星级变化
		const onCarStarChange = (value: string, option: any) => {
			const params = {...otherParams, carStar: option?.dictValue}
			setOtherParams(() => params)
		}

		// 订单类型变化
		const onRentTypeChange = (value: string, option: any) => {
			if (costitemList.length) {
				onChangeList('rentTypeId')
				setIsModalOpen(true)
			} else {
				const data = form.getFieldsValue()
				setCopyDataValue(() => data)
			}
			const params = {...otherParams, rentTypeName: option?.name}
			setOtherParams(() => params)
		}

		// 开始时间变化
		const onBeginTimeChange = () => {
			if (costitemList.length) {
				onChangeList('beginTime')
				setIsModalOpen(true)
			}
		}

		// 结束时间变化
		const onEndTimeChange = () => {
			if (costitemList.length) {
				onChangeList('endTime')
				setIsModalOpen(true)
			}
		}

		// 价格数据
		const onSubmitCostitemList = () => {
			const data = form.getFieldsValue()
			setCopyDataValue(() => data)
			if (selectItem?.key === 'rentTypeId') {
				setCostitemList([])
			} else {
				if (selectItem?.key === 'subjectId') {
					onCompany(data?.subjectId, true)
				}
				if (selectItem?.key === 'affiliatedCompanyId') {
					getCitysFun(data?.affiliatedCompanyId, true)
				}
				const list = costitemList?.map((item: any) => {
					const newItem = item
					newItem.rentDriverVOList = []
					newItem.rentChannelVOList = []
					return newItem
				})
				setCostitemList(list)
			}
			setIsModalOpen(false)
		}
		// 取消变化
		const onCancelCostitemList = () => {
			const params = {
				subjectId: copyDataValue?.subjectId,
				affiliatedCompanyId: copyDataValue?.affiliatedCompanyId,
				city: copyDataValue?.city,
				brandId: copyDataValue?.brandId,
				rentTypeId: copyDataValue?.rentTypeId,
				beginTime: copyDataValue?.beginTime,
			}
			form.setFieldsValue({
				...params,
			})
			setCopyDataName(() => copyDataName)
			setIsModalOpen(false)
		}

		const handerList = (costObject: any, formData: any) => {
			const list = JSON.parse(JSON.stringify(costObject))
			const rentSchemeVOList = list?.map((item: any) => {
				const newItem = item
				if (newItem?.id?.includes('ID')) {
					delete newItem.id
				}
				newItem.rentTypeId = formData?.rentTypeId
				newItem.rentTypeName = otherParams?.rentTypeName
				newItem?.rentDriverVOList?.map((rentDriverVO: any) => {
					const newRentDriverVO = rentDriverVO
					newRentDriverVO.awardCode = newRentDriverVO.awardCode
						? newRentDriverVO.awardCode
						: newRentDriverVO?.id
					newRentDriverVO.rentSchemeId = newItem?.id
					newRentDriverVO.activityCode = newRentDriverVO?.activityCode
						? newRentDriverVO?.activityCode
						: newRentDriverVO.rewardId
					newRentDriverVO.activityName = newRentDriverVO?.activityName
						? newRentDriverVO?.activityName
						: newRentDriverVO.rewardName
					newRentDriverVO.rentTypeId = formData?.rentTypeId
					newRentDriverVO.rentTypeName = otherParams?.rentTypeName
					newRentDriverVO.subsidyOrdertype =
						newRentDriverVO.subsidyTypename
					newRentDriverVO.beginTime = newRentDriverVO?.startTime
						? newRentDriverVO?.startTime
						: newRentDriverVO.beginTime
					newRentDriverVO.subjectName = otherParams?.subjectName
					newRentDriverVO.affiliatedCompany =
						otherParams?.affiliatedCompany
					newRentDriverVO.brandInfo = otherParams?.brandInfo
					newRentDriverVO.leaseTerm = newItem?.leaseTerm
					newRentDriverVO.processId = newItem?.processId
					return newRentDriverVO
				})
				newItem?.rentChannelVOList?.map((rentChannelVO: any) => {
					const newRentChannelVO = rentChannelVO
					newRentChannelVO.awardCode = newRentChannelVO?.awardCode
						? newRentChannelVO?.awardCode
						: newRentChannelVO.id
					newRentChannelVO.activityCode =
						newRentChannelVO?.activityCode
							? newRentChannelVO?.activityCode
							: newRentChannelVO.channelNo
					newRentChannelVO.activityName =
						newRentChannelVO?.activityName
							? newRentChannelVO?.activityName
							: newRentChannelVO.name
					newRentChannelVO.rentTypeId = formData?.rentTypeId
					newRentChannelVO.rentTypeName = otherParams?.rentTypeName
					newRentChannelVO.subsidyOrdertype =
						newRentChannelVO.subsidyTypename
					newRentChannelVO.channelTypeFirstlevel =
						newRentChannelVO?.channelTypeFirstlevel
							? newRentChannelVO?.channelTypeFirstlevel
							: newRentChannelVO?.channelTypeOneStr
					newRentChannelVO.channelTypeSecondary =
						newRentChannelVO?.channelTypeSecondary
							? newRentChannelVO?.channelTypeSecondary
							: newRentChannelVO?.channelTypeTwoStr
					newRentChannelVO.auditStatus = newRentChannelVO.statusStr
						? newRentChannelVO.statusStr
						: newRentChannelVO.auditStatus
					newRentChannelVO.beginTime = newRentChannelVO?.startDate
						? newRentChannelVO?.startDate
						: newRentChannelVO?.beginTime
					newRentChannelVO.endTime = newRentChannelVO?.endDate
						? newRentChannelVO?.endDate
						: newRentChannelVO?.endTime
					newRentChannelVO.subjectName = otherParams?.subjectName
					newRentChannelVO.affiliatedCompany =
						otherParams?.affiliatedCompany
					newRentChannelVO.brandInfo = otherParams?.brandInfo
					newRentChannelVO.leaseTerm = newItem?.leaseTerm
					newRentChannelVO.processId = newItem?.processId
					return newRentChannelVO
				})
				return newItem
			})
			return rentSchemeVOList
		}

		const submit = async () => {
			const formData = await form.validateFields()
			const rentSchemeVOList = handerList(costitemList, formData)
			let commodityName: any = ''
			if (!formData.commodityName || formData.commodityName === '') {
				commodityName = `${otherParams.subjectName}+${
					otherParams.cityName
				}+${otherParams.brandInfo}+${Date.now().toString(36).slice(2)}`
			} else {
				commodityName = formData.commodityName
			}

			if (rentSchemeVOList.length > 0) {
				if (type === 'add') {
					// 新增接口
					save({
						...formData,
						beginTime: moment(formData.beginTime).format(
							'YYYY-MM-DD',
						),
						endTime: moment(formData.endTime).format('YYYY-MM-DD'),
						rentSchemeVOList,
						...otherParams,
						commodityName,
					})
						.then((res: any) => {
							if (res?.success) {
								message.success(res?.msg)
								dispatch({
									type: 'global/deleteTabs',
									payload: currentRoute,
								})
								history.push({
									pathname:
										'/merchantCenter/commodityPlan/list',
								})
							}
						})
						.catch((err: any) => {
							message.error(err)
						})
				} else if (type === 'edit') {
					// 编辑接口
					editUpdate({
						...formData,
						beginTime: moment(formData.beginTime).format(
							'YYYY-MM-DD',
						),
						endTime: moment(formData.endTime).format('YYYY-MM-DD'),
						rentSchemeVOList,
						id: commodityPlanId,
						...otherParams,
						commodityName,
					})
						.then((res: any) => {
							if (res?.success) {
								message.success(res?.msg)
								dispatch({
									type: 'global/deleteTabs',
									payload: currentRoute,
								})
								history.push({
									pathname:
										'/merchantCenter/commodityPlan/list',
								})
							}
						})
						.catch((err: any) => {
							message.error(err)
						})
				} else if (type === 'copy') {
					// 复制接口
					copySave({
						...formData,
						beginTime: moment(formData.beginTime).format(
							'YYYY-MM-DD',
						),
						endTime: moment(formData.endTime).format('YYYY-MM-DD'),
						rentSchemeVOList,
						...otherParams,
						commodityName,
					})
						.then((res: any) => {
							if (res?.success) {
								message.success(res?.msg)
								dispatch({
									type: 'global/deleteTabs',
									payload: currentRoute,
								})
								history.push({
									pathname:
										'/merchantCenter/commodityPlan/list',
								})
							}
						})
						.catch((err: any) => {
							message.error(err)
						})
				}
			} else {
				message.warning('至少添加一条价格信息')
			}
		}
		const {run} = useRequest(submit, {
			throttleInterval: 2000,
			manual: true,
		})
		return (
			<div className={styles.admittanceAdd}>
				<div className={`${styles.content} ${styles.formDetils}`}>
					<Collapse
						defaultActiveKey={['1', '2']}
						ghost
						expandIconPosition="end">
						<Panel header={customizeHeader('基础信息')} key="1">
							<Form
								form={form}
								name="basic"
								layout="horizontal"
								labelCol={{flex: '120px'}}
								labelAlign="right"
								labelWrap
								initialValues={{remember: true}}
								autoComplete="off"
								disabled={type === 'view'}>
								<Row gutter={12}>
									<Col
										sm={{span: 24}}
										md={{span: 12}}
										lg={{span: 8}}>
										<Form.Item
											label="商品方案名称"
											name="commodityName">
											<Input
												placeholder="请输入商品方案名称"
												maxLength={30}
											/>
										</Form.Item>
									</Col>
									<Col
										sm={{span: 24}}
										md={{span: 12}}
										lg={{span: 8}}>
										<Form.Item
											label="主体名称"
											name="subjectId"
											rules={[{required: true}]}>
											<Select
												showSearch
												optionFilterProp="name"
												placeholder="请选择主体名称"
												fieldNames={{
													value: 'id',
													label: 'name',
												}}
												allowClear
												disabled={type === 'copy'}
												onChange={onSubjectNameChange}
												options={[...mainCompany]}
											/>
										</Form.Item>
									</Col>
									<Col
										sm={{span: 24}}
										md={{span: 12}}
										lg={{span: 8}}>
										<Form.Item
											label="所属公司"
											name="affiliatedCompanyId"
											rules={[{required: true}]}>
											<TreeSelect
												showSearch
												treeNodeFilterProp="name"
												allowClear
												style={{width: '100%'}}
												dropdownStyle={{
													maxHeight: 400,
													overflow: 'auto',
												}}
												placeholder="请选择"
												treeDefaultExpandAll
												disabled={type === 'copy'}
												fieldNames={{
													label: 'name',
													value: 'id',
												}}
												onChange={onOrgIdChange}
												treeDataSimpleMode
												treeData={companyData}
											/>
										</Form.Item>
									</Col>
									<Col
										sm={{span: 24}}
										md={{span: 12}}
										lg={{span: 8}}>
										<Form.Item
											label="城市名称"
											name="city"
											rules={[{required: true}]}>
											<Cascader
												allowClear
												fieldNames={{
													label: 'name',
													value: 'id',
													children: 'cityInfoList',
												}}
												options={citysList}
												disabled={type === 'copy'}
												onChange={onCityChange}
												placeholder="请选择城市名称"
											/>
										</Form.Item>
									</Col>
									<Col
										sm={{span: 24}}
										md={{span: 12}}
										lg={{span: 8}}>
										<Form.Item
											label="品牌/车系/车型"
											name="brandId"
											rules={[{required: true}]}>
											<Select
												showSearch
												optionFilterProp="fullName"
												placeholder="请选择品牌/车系/车型"
												fieldNames={{
													value: 'id',
													label: 'fullName',
												}}
												disabled={type === 'copy'}
												onChange={onBrandIdChange}
												options={[...carTypeList]}
											/>
										</Form.Item>
									</Col>
									<Col
										sm={{span: 24}}
										md={{span: 12}}
										lg={{span: 8}}>
										<Form.Item
											label="车辆星级"
											name="carStarId"
											rules={[{required: true}]}>
											<Select
												showSearch
												optionFilterProp="dictValue"
												//  mode="multiple"
												placeholder="请选择车辆星级"
												fieldNames={{
													value: 'dictKey',
													label: 'dictValue',
												}}
												disabled={type === 'copy'}
												onChange={onCarStarChange}
												options={[...dict.star_rating]}
											/>
										</Form.Item>
									</Col>
									<Col
										sm={{span: 24}}
										md={{span: 12}}
										lg={{span: 8}}>
										<Form.Item
											label="订单类型"
											name="rentTypeId"
											rules={[{required: true}]}>
											<Select
												allowClear
												optionFilterProp="name"
												placeholder="请选择订单类型"
												fieldNames={{
													value: 'code',
													label: 'name',
												}}
												disabled={type === 'copy'}
												onChange={onRentTypeChange}
												options={[...orderType]}
											/>
										</Form.Item>
									</Col>
									<Col
										sm={{span: 24}}
										md={{span: 12}}
										lg={{span: 8}}>
										<Form.Item
											label="押金"
											name="mortgageAmount"
											getValueFromEvent={
												(event: any) =>
													event.target.value.replace(
														/^(-)*(\d+)\.(\d\d).*$/,
														'$1$2.$3',
													) // 只能输入两位小数
											}
											rules={[
												{
													required: true,
													pattern: twoDecimalPattern,
													message:
														'请输入正确的押金金额',
												},
											]}>
											<Input
												placeholder="请输入押金"
												maxLength={10}
											/>
										</Form.Item>
									</Col>
									<Col
										sm={{span: 24}}
										md={{span: 12}}
										lg={{span: 8}}>
										<Form.Item
											label="定金"
											name="depositAmount"
											getValueFromEvent={
												(event: any) =>
													event.target.value.replace(
														/^(-)*(\d+)\.(\d\d).*$/,
														'$1$2.$3',
													) // 只能输入两位小数
											}
											rules={[
												{
													required: true,
													pattern: twoDecimalPattern,
													message:
														'请输入正确的定金金额',
												},
											]}>
											<Input
												placeholder="请输入定金"
												maxLength={10}
											/>
										</Form.Item>
									</Col>
									<Col
										sm={{span: 24}}
										md={{span: 12}}
										lg={{span: 8}}>
										<Form.Item
											label="开始时间"
											name="beginTime"
											rules={[{required: true}]}>
											<DatePicker
												format="YYYY-MM-DD"
												onChange={onBeginTimeChange}
												disabledDate={
													disabledFinishTimeDate
												}
											/>
										</Form.Item>
									</Col>
									<Col
										sm={{span: 24}}
										md={{span: 12}}
										lg={{span: 8}}>
										<Form.Item
											label="结束时间"
											name="endTime"
											rules={[{required: true}]}>
											<DatePicker
												format="YYYY-MM-DD"
												onChange={onEndTimeChange}
												disabledDate={
													disabledStartTimeDate
												}
											/>
										</Form.Item>
									</Col>
									<Col sm={{span: 24}} />
									<Col
										sm={{span: 24}}
										md={{span: 12}}
										lg={{span: 8}}>
										<Form.Item label="备注" name="remarks">
											<TextArea
												maxLength={200}
												placeholder="请填写备注信息，不超过200个字符"
												autoSize={{
													minRows: 3,
													maxRows: 6,
												}}
											/>
										</Form.Item>
									</Col>
								</Row>
							</Form>
						</Panel>
						<Panel header={customizeHeader('价格信息')} key="2">
							<>
								{copyDataValue?.rentTypeId === '1' ||
								copyDataValue?.rentTypeId === '5' ? (
									<OrderTypeOne
										type={type}
										onlyCode={onlyCode}
										onlyChannelCode={onlyChannelCode}
										otherParams={otherParams}
										data={form.getFieldsValue()}
										costitemList={costitemList}
										setCostitemList={(res: any) => {
											setCostitemList(() => res)
										}}
									/>
								) : null}
								{copyDataValue?.rentTypeId === '4' ? (
									<OrderTypeTwo
										type={type}
										onlyCode={onlyCode}
										onlyChannelCode={onlyChannelCode}
										data={form.getFieldsValue()}
										otherParams={otherParams}
										costitemList={costitemList}
										setCostitemList={(res: any) => {
											setCostitemList(() => res)
										}}
									/>
								) : null}
								{copyDataValue?.rentTypeId === '2' ||
								copyDataValue?.rentTypeId === '3' ? (
									<OrderTypeThree
										type={type}
										onlyCode={onlyCode}
										onlyChannelCode={onlyChannelCode}
										data={form.getFieldsValue()}
										otherParams={otherParams}
										costitemList={costitemList}
										setCostitemList={(res: any) => {
											setCostitemList(() => res)
										}}
									/>
								) : null}
							</>
						</Panel>
					</Collapse>
					<div className={styles.wrap}>
						<Button
							onClick={() => {
								dispatch({
									type: 'global/deleteTabs',
									payload: currentRoute,
								})
								history.push({
									pathname:
										'/merchantCenter/commodityPlan/list',
								})
							}}>
							取消
						</Button>
						{type === 'add' ||
						type === 'edit' ||
						type === 'copy' ? (
							<>
								<Button
									type="primary"
									htmlType="submit"
									onClick={run}>
									提交
								</Button>
							</>
						) : (
							''
						)}
					</div>
					<Modal
						text={`${selectItem?.msg}`}
						onSubmit={onSubmitCostitemList}
						onCancel={onCancelCostitemList}
						isModalOpen={isModalOpen}
						setIsModalOpen={setIsModalOpen}
					/>
				</div>
			</div>
		)
	},
)
export default connect(({global, user}: any) => ({global, user}))(view)
